<template>
  <div class="h5-wrapper">
    <div class="content">
      <router-view></router-view>
    </div>
    <nav class="tabbar">
      <router-link to="/home/main">
        <!-- <div class="icon"> -->
          <van-icon name="like-o" class="icon" />
          <!-- </div> -->
        <span>首页</span>
        </router-link>
      <router-link to="/home/find">
        <van-icon name="search" />
        <span>找房</span>
        </router-link>
      <router-link to="/home/massage">
        <van-icon name="comment-o" />
       <span>咨询</span>
        </router-link>
      <router-link to="/home/my">
        <van-icon name="user-o" />
        <span>我的</span>
        </router-link>
    </nav>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  name: "VueJobHome",

  data() {
    return {
    };
  },

  mounted() {
    
  },

  methods: {
   
  },
};
</script>

<style>
body {
  margin: 0;
  padding: 0;
}
</style>
<style lang="less" scoped>
.h5-wrapper {
  .content {
    margin-bottom: 51px;
  }
  .tabbar {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50px;
    line-height: 20px;
    text-align: center;
    display: flex;
    background: #fff;
    border-top: 1px solid #e4e4e4;
    justify-content: center;
    align-items: center;

    

    a {
      flex: 1;
      text-decoration: none;
      font-size: 21px;
      color: #888;  
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      -webkit-tap-highlight-color: transparent;
      span{
        font-size: 12px;
      }
      &.router-link-active {
        color: #fa0;
      }

    }
  }
}
</style>
